<template>
  <div>
    <table border="1">
      <thead>
        <tr>
          <th>标题</th>
          <th>价格</th>
          <th>简介</th>
          <th>图片</th>
          <th>属性</th>
          <th>操作<router-link to="/admin/edit">新增</router-link></th>
        </tr>
      </thead>
      <tbody>
        <tr v-for="(item, key) in products">
          <td>{{item.title}}</td>
          <td>{{item.price}}</td>
          <td>{{item.intro}}</td>
          <td>{{item.images.length}}</td>
          <td>{{item.parameter}}</td>
          <td><button @click="edit(item._id)">编辑</button><button @click="delProduct(item._id)">删除</button></td>
        </tr>
      </tbody>
    </table>
  </div>
</template>
<script>
export default {
  data() {
    return {
      products: [
        
      ]
    }
  },
  async beforeMount() {
    let res = await this.$store.dispatch('getProducts')
    console.log(res)
    if (res.success) this.products = res.data
  },
  methods: {
    edit(_id) {
      this.$router.push(`/admin/edit?_id=${_id}`)
    },
    async delProduct(_id) {
      let res = await this.$store.dispatch('delProduct', _id)
      if (res.success) {
        alert('删除成功')
        window.location.reload()
      }
    }
  }
}
</script>
<style lang="sass">
table
  width: 1000px
  margin: 0 auto
</style>

